<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // requestAnimationFrame 跟setTimeout 作用一致，但是性能更好，不需要设置时间间隔

        var timer=null;
        //1.不需要设置时间间隔，根据浏览器刷新频率走的，不会存在丢帧、卡帧
        //2.如果切换屏幕，requestAnimationFrame 写动画会停止,setTimeout/setInterval写的动画，会在后台继续运行,当切回屏幕的时候,requestAnimationFrame 写的动画，会在停的位置继续运行
        //缺点：低版本浏览器不支持（目前低版本基本被淘汰）
        //     只能代替setTimeout,不能代替setInterval
        timer=requestAnimationFrame(()=>{
           console.log("111");
           //清除
           cancelAnimationFrame(timer);
           timer=null;
        })

    </script>
</body>
</html>